import React from 'react';
import { inject, observer } from 'mobx-react';
import {Modal, Button, Spin} from 'antd';
import {WeaRightMenu,WeaDialog } from 'ecCom';
import {WeaTableNew} from 'comsMobx';
const WeaTable = WeaTableNew.WeaTable;
import isEmpty from 'lodash/isEmpty'
import * as mobx from 'mobx'
const confirm = Modal.confirm;
import { WeaLocaleProvider } from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;

/**
* 借款明细弹出框
*/
@inject('detailModalStore')
@observer
class DetailModal extends React.Component {
	constructor(props) {
        super(props);
  }

  componentDidMount(){
      //一些初始化请求
    const {detailModalStore,detailData} = this.props;
    const {initDatas} = detailModalStore;
    initDatas(mobx.toJS(detailData));
  }

  componentWillReceiveProps(nextProps) {
    
  }

  shouldComponentUpdate(nextProps, nextState) {
      return true;
  }

  componentWillUnmount() {
    //组件卸载时一般清理一些状态
  }

	render(){
    const { visible } = this.props;
    const { detailModalStore } = this.props;
    const { tableStore,loading } = detailModalStore;

    return(
				<WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@s2uxpx`}
              className = "weaver-fna-modal-padding"
              icon='icon-coms-Finance'
              iconBgcolor='#f14a2d'
			        title={getLabel(387275,'借款明细')}
			        visible={visible}
			        style={{width:826}}
              maskClosable={false}
              onCancel={this.handleCancel}
        			buttons={this.getBottomButton()}
              moreBtn={{datas:this.getRightMenu(),collectParams:{favname:getLabel(28111,'收藏'), favouritetype:5}}}
		    >
		    <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@jd0olk`} 
          datas={this.getRightMenu()}
          collectParams={{favname:getLabel(28111,'收藏'), favouritetype:5}}
        >   

        <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@mawtgj`} 
            comsWeaTableStore={tableStore}
            hasOrder={true}
            needScroll={true} 
            onOperatesClick={this.operator.bind(this)}
            getColumns={this.getColumnsInfo}
        />

        </WeaRightMenu>
   			</WeaDialog>
		)
	}

  //重构Table
  getColumnsInfo = (data) => {
    const that = this;
    if(!isEmpty(data)){
      for(let index=0;index<data.length;index++){
          /*
          if(data[index].dbField == 'requestname'){
              data[index].render = (text, record, index) => {
                return (<a onClick={() => {
                  let url = "/workflow/request/ViewRequestForwardSPA.jsp?requestid="+record.requestid+"&LoanRepaymentAnalysisInnerDetaile=1";
                  window.open(url,"_blank");
                }}>{text}</a>);
              }
          }
          */
      }
    }
  }

  //右下角点击按钮
  getBottomButton = () => {
    let buts=[];
    const { detailModalStore } = this.props;
    const { loading } = detailModalStore;

    buts.push(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@7apftv@ExportExcel`} type="primary" style={{marginRight:5}} onClick={this.exportExcel.bind(this)} disabled={loading}>{getLabel(28343,'导出Excel')}</Button>);

    return buts;
  }

  //导出Excel
  exportExcel = () => {
    const { detailModalStore,detailData } = this.props;
    const {  } = detailModalStore;
    let hrmid = mobx.toJS(detailData).hrmid;
    let requestid = mobx.toJS(detailData).requestid;
    let url = "/api/fna/excel/exportLoanRepaymentDetaile?hrmid="+hrmid+"&requestid="+requestid;
    window.location.href = url;
  }

  //操作判断按钮
  operator(record,index,operate,flag){
    const { detailModalStore } = this.props;
    const { } = detailModalStore;
    let id = record.id;
    let that = this;
    if(flag == '1'){//编辑

    }
  }

  //右键菜单
  getRightMenu = () => {
    let btns = [];
    const { detailModalStore } = this.props;
    const { tableStore,dataKey,loading } = detailModalStore;

    btns.push({
      key:"export",
      icon: <i className='icon-coms-export'/>,
      content:getLabel(28343,'导出Excel'),
      disabled:loading,
      onClick: () =>{
        this.exportExcel();
      }
    });

    btns.push({
        key:"view",
        icon: <i className='icon-coms-Custom'/>,
        content:getLabel(32535,'显示列定制'),
        onClick: () =>{
            tableStore.setColSetVisible(dataKey,true);
            tableStore.tableColSet(dataKey,true);
        }
    });
    
    return btns;
  }
  
  //取消当前弹出框
  handleCancel = () => {
    const {setVisibleModal} = this.props;
    const {} = this.props.detailModalStore;
    setVisibleModal(false);
  }

  //点击方案名称也能弹出编辑框
  openEditPage = (record) => {
    const { detailModalStore } = this.props;
    const { } = detailModalStore;
    let id = record.id;
  }
}

export default DetailModal;